演示/演讲：打破助记媒介的传统窠臼

原文：Demo/talk: breaking the mnemonic medium out of its box | Patreon 上的 Andy Matuschak

演示视频：https://youtu.be/LRUWdwGZuLA

在本次演讲中，我将介绍助记媒介的一系列全新原语，重点聚焦于我从上一轮原型设计过程中提炼出的问题与机遇（可在此处观看相关演讲）。

即便你对这个特定项目不甚感兴趣，或许仍会对我如何剖析并迭代这样一个非同寻常的设计难题的架构思路感到有趣。

非常欢迎提出反馈意见。为方便指明具体段落，我在下方附上了演讲稿文本（但请注意，若无相应的视觉材料配合，单凭文本可能难以理解其确切含义）。

讲话稿

• 大家好。

  • 今天，我将与大家分享助记媒介的一个全新迭代版本。

  • 如同我在五月份所展示的设计方案一样，这项工作致力于解决一个特定问题：最初为《量子国度》设计的媒介，在应用于技术入门读物以外的场景时，会显得刻板且体验不佳。

    • 我们应如何打造一个更为灵活的助记媒介——使其能够适用于非技术类书籍、非正式文章、参考资料、学术论文等多种载体？

    • 在本视频中，我将假定各位已经观看过五月份的那次演讲。如果尚未观看，建议您先观看其前五分钟以及第 10 至 13 分钟的内容，以了解我当前试图解决的问题的背景信息。

• 接下来，这是我们的计划：首先，我会简要回顾我在五月演讲中所提出设计的核心要素；然后，我将阐述通过用户观察和设计评审所发现的问题；最后，我会展示一个旨在解决这些问题的新版媒介。

• 好的！首先，让我们用两分钟时间回顾一下我五月演讲中介绍的设计方案。[播放五月演讲视频的 26:05 至 27:41 片段]

• 为测试此设计方案，我以一本相对非正式的产品管理书籍 Shape Up 为载体，实现了一个原型。

  • 我选择这本书的原因在于，我认为它会加剧我所观察到的该媒介存在的诸多问题。

  • 书中内容往往具有情境依赖性、充满争议、富含启发性，且多涉及价值观或个人观点。

  • 读者对这本书的体验会因其背景知识的差异而截然不同：经验相对不足的测试读者可能会希望非常仔细地研读，而经验更为丰富的读者则会选择快速浏览，从中撷取有价值的精华。

  • 它既不属于正式著述，也非技术文献；然而，它却是一部严肃的作品，对某些读者而言，值得深入研究。

• 在六月和七月，我观察了十几位用户实时阅读原型书籍，并让他们同时大声说出自己的想法和反应。我还从另外几十位读者那里收集了异步的「有声思考」日记，并从与一些慷慨的设计师朋友进行的富有见地的评审会议中获益良多。

  • 我从这些读者那里获得的反馈令人鼓舞——我认为这种媒介能够在类似这本书的场景下发挥作用，并且我相信这样做对许多读者而言将极具价值。

  • 然而，不出所料，这些测试过程也暴露了许多问题。其中一些或许看似表层设计问题——某些地方仅仅需要进一步打磨——但我今天将要讨论的困境则是真正结构性的。修正它们的正确途径在于对媒介的概念架构进行调整。

• 现在，让我们深入探讨其中的一些问题。概括而言，它们可以分为两大类：首先是与文本周边的 Orbit 标记和侧边栏相关的问题；其次是与嵌入式复习框相关的问题。

• Orbit 标记和侧边栏呈现了一系列相互关联的问题：

  • 首先，一个普遍的观察结果是：卡片给人的感觉与文本之间存在不必要的「疏离感」。

    • 从字面意义上看，如果你使用的是大尺寸显示器，情况如此——它们在水平方向上会被一大片空白区域隔开。

  • 但从概念层面看，这种疏离感也同样存在：一道可见的界限横亘其间。卡片信息被禁锢在这个侧边栏的方框内，与它们所引用的文本分离开来。

    • Niko Klein 向我指出，如果你观察人们实际是如何在书上做笔记的，就会发现他们的做法远没有这么规整。他们的注释会很自然地「侵入」到正文中。

  • 在当前的设计中，Orbit 卡片显得有些「畏首畏尾」，不愿与文本直接接触。页边空白处虽然设有标记，但文本本身却没有任何与相关卡片建立连接的指示。读者必须在脑海中自行将卡片信息与原文材料联系起来。

    • 有时这样做是恰当的：某些卡片是从宏观层面进行综合或总结，确实不存在一段长度适宜、能够与之在视觉上直接关联的文本。某种程度的间接性是必要的。

    • 然而，大量的卡片都聚焦于文本段落中的原词原句。让这种连接变得如此间接，感觉颇为怪异。

  • 另一个不恰当间接性的问题在于：对于那些仅包含一张卡片的 Orbit 标记而言，标记本身与卡片之间的区分显得过于繁琐笨重。

    • 我注意到这里的这个标记；我点击它——结果它在那里显示了这个单独的卡片，同时又在这里弹出了一个上下文菜单，菜单里只有一个用于保存此卡片的按钮。

    • 但是，卡片本身也有一个我可以点击用来添加它的按钮。

  • 此处我们有了两个不同的抽象概念，而它们实际上都代表了同一个概念性对象。至少在当前这种情况下，这两个角色之间的区别并不足以支撑这种重复设计的合理性。并且，它们之间的联系也表现得不恰当的间接，仅仅通过卡片的彩色边框及其大致的空间位置来示意。

  • 这两个东西不能是同一个东西吗？

• 当然，我之所以区分 Orbit 标记和卡片本身，主要原因在于，许多情况下，Orbit 标记代表了若干张卡片，它们从不同角度共同强化同一个概念。

  • 《量子国度》的第一章包含了 112 张卡片。你肯定不希望页边空白处漂浮着 112 个这样的标记，尤其考虑到许多卡片都围绕着相同的核心思想。

  • 批量操作对于控制媒介的交互成本至关重要。这正是这些 Orbit 标记诞生的初衷——实现批量操作。

    • 这一点实际上也揭示了标记存在的另一个问题：它们给人的感觉像是在巧妙地隐藏信息。这个标记究竟代表一张还是六张卡片？我必须与之交互才能弄清楚。但这些信息本身就是一种有用的线索：如果这里有很多卡片，那就意味着这是一段重要的文字。如果我觉得某段文字仅有少量趣味，我可能会直接跳过一个包含六张卡片的标记——太麻烦了——但我会考虑只包含一张卡片的标记。

• 或许部分是由于标记在这种独立界面上「隐藏」卡片的方式，许多读者发现自己总是在反复调整侧边栏，无论将其固定打开还是保持关闭，都感到不自在。

  • 最后，标记还造成了一些始料未及的非对称性——这通常是设计师尚未完全理清其抽象概念的一个信号。

    • 第一个非对称性在于，如果你自己编写了一张卡片，文本本身并不会有任何相应的指示。页边空白处的 Orbit 标记仅用于作者提供的卡片。

    • 由此便引出了第二个非对称性：读者用于编写卡片的界面，不能等同于作者用于编写卡片的界面。在五月份的设计方案中，作者还需要负责放置 Orbit 标记，并决定如何在这些标记之间分配卡片。抛开非对称性不谈，这种额外的工作量本身就显得不甚理想，而且可能并无必要。

• 标记和侧边栏与直接嵌入文本中的复习框协同工作。这些元素自身也存在一些独立的概念性问题。

  • 需要再次说明的是，在《Shape Up》这类相对非正式的文本场景中，我们的设想是，放置在章节末尾的复习框会包含一系列经过精心筛选的核心观点——大约 5 到 10 张卡片。但读者可以在阅读过程中，通过点击他们认为特别重要的段落旁边的 Orbit 标记，来选择保存更多细节。这些额外保存的卡片会被添加到章节末尾的复习框中。

  • 这个方案的一个问题在于，复习框的行为会让那些在阅读时保存了额外卡片的细心读者感到困惑。那些嵌入式的复习内容既包括了由作者精心策划的卡片，也包括了读者自己保存的卡片，两者之间并没有明确的区分。

    • 让这些复习框展示一部分精选卡片，作为一种引导性的辅助框架，这本身是合理的；但是，将读者自行保存的卡片也包含进来，则模糊了复习框作为一种「作者创作物」的概念身份。

  • 更糟糕的是，当你已经花费精力在阅读时评估并选择保存哪些卡片——更重要的是，有意识地决定不保存某些卡片之后——再在复习环节中被强行插入额外的卡片，会让人感觉被打扰，因为它模棱两可地让人以为复习的目的就是查看自己当初保存的那些卡片。

  • 除了这种困惑之外，对于某些读者而言，复习环节感觉「为时过早」。

    • 我们在《量子国度》项目中并未收到此类反馈。造成这种差异的一个原因，可能在于《Shape Up》这本书的内容要直观得多，读者不太可能那么快就忘记。

    • 但这里还存在一个更深层次的问题：如果你在阅读时就在侧边栏中审阅和评估卡片，那就意味着当你到达嵌入式复习框时，你实际上已经进行过一次非正式的复习了。因此，感觉复习「为时过早」是合乎情理的——毕竟你几分钟前才刚看过那些卡片。

      • 这与《量子国度》的体验截然不同。在后者中，你可能几分钟前才阅读过文本，但在进行首次复习之前，你从未见过实际的问题。

  • 另一些读者则表现得非常功利。书中大部分内容他们早已熟悉，他们只是在快速浏览，寻找可以借鉴的「珍珠」。这些功利型读者觉得嵌入式的复习环节要求过高，即便它可以切换到列表模式或被直接跳过。那种暗示他们「理应」复习所学材料的意味，与他们对待这本书的立场显得格格不入。

  • 我认为此处的根本问题在于：在上一个原型设计中，我首先默认了《量子国度》的基本设计，然后在其上添加新的原语以应对更多应用场景。

    • 但这导致了某种概念上的割裂。我们有侧边栏和行内卡片所构成的世界，同时又有嵌入式复习框所构成的另一个世界。我在这两者之间勉强搭建了一座桥梁，但它们在概念上尚未实现真正的统一。

    • 在这次新的设计工作中，我探索了另一种可能性：如果我不从预设嵌入式复习框开始，结果会怎样？取而代之的是，我尝试首先为像《Shape Up》这类书籍的读者进行设计，然后再研究如何对这些设计元素进行扩展和完善，以适应像《量子国度》这样对功能要求更高的教科书。

• 基于此，让我们来看一看助记媒介的一个全新迭代版本，我尝试在其中解决上述所有问题。

  • 与五月份的演讲一样，这些设计将假定读者已经熟悉本媒介及间隔重复。这些设计方案还需要额外的引导提示和流程来帮助新用户上手，但我会在对原语感到满意之后，再专注于这些方面。

• 首先，也是最为显著的一点是，我将三大原语——页边卡片、Orbit 标记和侧边栏——整合为一。

  • 一种设计低调的卡片会直接显示在主文本旁边，而非置于独立的侧边栏中。

  • 当一段文字仅关联一张卡片时，我们不再需要任何形式的批量间接处理。我们直接就能看到那张卡片。

  • 将鼠标悬停其上即可展开其完整内容，我们只需简单点击便可将其保存至我们的 Orbit 笔记中。

    • 我们将在下一次复习会话中看到它，或者也可以随时通过悬浮的 Orbit 菜单启动复习。

  • 这张卡片强化了文本中的一个原词原句，因此该短语现在会被高亮显示。鼠标悬停的交互效果进一步加强了这种关联性。

    • 并非所有卡片都会像这样与特定短语相关联，但如果这种联系确实存在，我们可以将其呈现出来。

  • 在以往的设计中，我曾极力试图让卡片不那么引人注目，以免打扰那些并不在意记住每一个细节的读者。但真正让我在此处豁然开朗的见解是：一旦读者采取行动保存了一张卡片，那张卡片完全可以在视觉上「彰显」自身的存在感。当你在自己的书上用彩色荧光笔做标记时，你根本无需担心自己造成的「混乱」。

• 我相信批量交互对于助记媒介而言仍然至关重要。大多数时候，读者希望表达的是他们对某个概念的兴趣，而非某个特定的卡片——而要充分覆盖一个概念，往往需要多张卡片。

  • 在这个迭代版本的媒介中，相互重叠的卡片会被折叠起来，以一种「批量」的形式显示在文本旁边。

• 无需任何交互，我们就能看到其中包含了多少张卡片。如果我们将光标移到此处，便可以通过一次点击快速保存所有卡片，或者更有选择性地评估哪些是我们可能希望保留的。

• 现在，作者和读者的创作体验可以实现对称：如果我们添加自己的卡片，它会与我们从作者那里保存的卡片并列显示，并且在文本中享有相同的高亮显示功能。不再需要费力去放置 Orbit 标记并定义它们与卡片之间的关联。

• 文本与卡片之间更紧密的联系，让我们得以运用另一个技巧：如果我们对某个短语特别感兴趣，并且发现自己想要将其内化吸收，我们可能会选中这段文本，如同准备撰写一张卡片一样。但如果这是一段重要的内容，作者可能早已就此观点提供过卡片了。因此，当作者所设卡片的锚点与用户的选区发生重叠时，我们会主动呈现作者的卡片，并使其易于保存。

  • 当然，如果你愿意，也可以编辑作者的卡片，使其更符合你对该观点的个人理解。编辑往往比从头创建更为容易。

• 显而易见，这种浮动卡片的样式并不能自动适用于所有网页布局。

  • 在简单情况下，例如页边空白处有旁注或图表时，我们可以尝试自动调整卡片的位置以避开这些元素。

  • 若正文文本紧贴屏幕边缘布局——当然，也包括在移动设备上——我们将需要某种「折叠」的呈现方式。

  • 并且，如果用户觉得这些卡片碍眼，应当能够将其隐藏。

  • 但至少在目前，我更感兴趣的是探索理想情况下的效果，即作者在进行文本布局时就已将本媒介的特性考虑在内，或者可能有人创建了用户样式表，能够对网站布局进行适当的适配。一旦我确信理想情况下的方案确实行之有效，我才会着手处理那些不甚理想的场景。

• 以上便是新的浮动卡片原语，它们取代了原有的 Orbit 标记、侧边栏以及侧边栏卡片。

  • 现在，这些都属于次级交互，在文本的层级结构中，其所处位置与页边旁注类似。它们为高度专注的读者提供了额外的阅读深度，而不会干扰文本的主要线性阅读流程。

  • 但正如插图既可以出现在页边空白处，也可以置于文本正文之内一样，作者能够将卡片同时作为页边笔记和正文内的对象来呈现，也是合乎情理的——例如，可以放在章节末尾，或者放在总结某部分核心要点的段落之后。至于以这种方式呈现卡片的频率和数量，则取决于书籍本身及其目标读者群体。

• 以《Shape Up》这本书为例，我认为在每章末尾提供一个简短的、经过悉心筛选的卡片列表，涵盖最重要的观点，将会非常有价值。

  • 由于这本书相对非正式，且其内容相当直观易懂，我认为我们不必像先前版本的媒介那样，在默认情况下就强力推动读者立即复习这些卡片。

  • 我与读者交流后发现，这类书籍的难点并不在于阅读时理解内容，也不在于当天晚些时候能否记住它。真正的困难在于，数日或数周之后，当你初次尝试应用这些知识时，能否忆起相关的细节。

    • 因此，在这种情况下，助记媒介的首要任务应该是让人们能够在未来的某个日子里，通过复习会话轻松地重温那些关键点。

  • 具体实现可能是这样的：一个轻量化的模块，可以直接集成到文本正文之中。

    • 从结构上看，这个模块类似于你在印刷书籍中可能见到的那种摘要卡片框，当然，不同之处在于它是一个更宏大的交互式工作流程的组成部分。

    • 我可能会快速浏览这些卡片，判断它们整体上看起来不错，然后点击一次性保存所有卡片。

    • 或者，我也可以进行快速筛选，用鼠标在列表上向下滚动，逐一审视每张卡片，并添加那些令我感到惊讶或认为有意义的条目。

      • 请注意，这种滚动浏览的交互本身也兼具一种极其轻量级的非正式复习功能。

    • 这个模块的内容由作者定义。它不会像之前的设计那样，试图同时充当你之前在文本中保存的其他卡片的列表。

  • 那么，如果我正在非常认真地学习这本书，并且感觉其内容并非那么直观易懂，此时进行一次快速复习或许会对我有益。

    • 我可以点击此处来启动复习。

      • 如此一来，复习体验就不必局限于一个小小的行内区域——我们可以创建一个专注的模态对话框环境。

    • 我可以按常规方式进行复习，或者跳过那些我不感兴趣的卡片。

    • 我只复习刚才在那个框中所见的卡片——我之前保存的其他卡片并不会混杂进来。

    • 但是，一旦我完成复习，界面会询问我是否愿意额外复习一下我到目前为止保存的其他卡片。

      • 如果我选择了复习这些精选卡片，那么我可能正在进行细致阅读，因此我或许也想复习所有其他内容。但通过将此设为复习会话的一个独立「阶段」，我们便避免了先前复习框设计中因混合呈现精选卡片和用户已存卡片所造成的混淆。

    • 复习会话结束后，我所复习的新卡片会自动保存到我的 Orbit 笔记中。对于选择进行行内复习的用户而言，这或许是最普遍的期望。但当然，我也可以撤销此操作，或在下方的列表中修改我已保存的卡片集合。

• 通过将卡片直接嵌入文本正文而非页边空白，作者可以更主动地引导读者。这仿佛是在说：嘿，你或许应该考虑把这些卡片记录下来。读者会由此感知到一种「默认选项」。而更为专注的读者则可以通过选择当场复习相关材料来进一步提升学习投入。

• 但对于像《量子国度》或这本统计学教科书这样更为正式的教学文本而言——尤其是当内容本身较难理解时——作者应当能够设定一种要求更高的默认学习方式。他们应该能够明确指出：读者，你现在或许就应该复习一下本节的核心概念。

  • 针对这种情况，助记媒介传统的嵌入式复习框设计依然非常合理。

    • 这些穿插于文本中的复习环节，其作用不仅仅是当场巩固所学材料。许多读者向我们反映，嵌入式复习能促使他们放慢阅读速度，更仔细地阅读——或重读。另一些读者则表示，复习环节给他们带来了一种安全感：他们感觉自己处于作者的引导之下，并且清楚自己不会在尚未充分理解的情况下超前阅读太多。

      • 更为微妙的是，我推测行内复习能够将卡片锚定在更宏观的解释性文字的语境之中，如此一来，当你看到一张卡片时，便会联想到文本的相应章节以及其中所有相关的概念。这或许有助于避免人们在使用可单独下载的间隔重复卡片组时遇到的一个关键问题：即感觉卡片之间缺乏联系、过于零散，甚至显得有些随意。

    • 因此，我们不应摒弃嵌入式复习的想法。它确实对读者提出了一定的要求，但也带来了显著的益处。当这些益处对于文本的主要目标读者群体而言，其价值可能高于所需付出的成本时，作者就应当将穿插复习设为「默认选项」。

  • 即便如此，我们仍然可以对该原语进行改进。

  • 在这个迭代版本的设计中，嵌入式复习仅包含由作者精心筛选的一组卡片，而不会混入你可能已经自行编写或保存的任何额外卡片。但是，如果你在此之外还添加了一些额外的卡片，我们会在读者完成对筛选卡片的复习之后，询问他们是否愿意接着处理那些额外卡片，正如我们几分钟前在模态复习框中所见到的那样。

  • 与之前一样，当你完成复习后，那些你复习过的卡片（而非跳过的卡片）会自动保存下来。并且你可以轻松地撤销此操作。

  • 对于那些对文本内容已有一定了解的读者而言，他们可能不愿费心进行这种引导式的复习。他们可以将行内复习模块切换至我们先前展示过的卡片列表模块，并保存任何他们觉得不熟悉的卡片。

• 在像《Shape Up》这类相对非正式的文本中，其读者的背景知识和兴趣点差异巨大，因此在卡片中提供多个不同层次的细节是很有意义的。

  • 章节末尾的卡片列表经过精心筛选，旨在涵盖最重要的核心观点——这些是任何严肃的读者都应当从书中领悟和带走的内容。而对更多细节或次要观点感兴趣的读者，则可以在阅读过程中利用浮动卡片来保存与那些观点相关的卡片。

  • 但在一本引导性极强的教科书中，我认为嵌入式复习模块包含该章节的所有卡片通常更为合理。读者倾向于通过选择阅读和复习哪些章节来表达他们的兴趣，而非通过挑选单张卡片。

    • 对于引导性极强的教科书，用浮动卡片来分散读者的注意力可能并无意义——因为无论如何，他们几分钟后都会复习所有这些卡片。

    • 因此，作者或许可以为这种浮动卡片的可见性设置一个网站级别的默认值。例如，一本教科书可以将其默认设置为仅显示已保存的卡片，这样浮动卡片在初次阅读时就不会分散注意力，但在读者完成该章节的嵌入式复习之后，便能在上文的相应语境中看到已保存的卡片。

    • 当然，如果读者愿意，他们也可以更改该设置，不采用默认值。

• 总而言之，这项新设计将 Orbit 标记、侧边栏卡片以及侧边栏本身整合为一个单一的浮动卡片原语。我更为清晰地定义了一个嵌入式卡片列表原语，并改进了嵌入式复习原语的行为方式。

  • 接下来，我将进行另一轮设计评审和修订，然后构建出这个原型，以便了解它会给读者的感受和行为带来怎样的影响。非常欢迎各位提供反馈。

• 我要感谢所有测试了最新原型并同步或异步提供反馈的读者。我尤其要感谢以下慷慨提供深入评审意见的设计师们：Cameron Burgess, Shan Carter, Gray Crawford, Joe Edelman, Niko Klein, Marisa Lu, Rob Ochshorn, 以及 Yiliu Shen-Burke。